<!-- Navigation Start -->
<div class="navigation navbar navbar-light bg-primary">
    <!-- Logo Start -->
    <a class="d-none d-xl-block bg-light rounded p-1" href="#">
        <!-- Default :: Inline SVG -->
  
        
        <!-- Alternate :: External File link -->
        <img class="injectable" src="__UPLOAD__/{:$configs['SYSTEM_LOGO']}" height="30" width="30" alt="">
    </a>
    <!-- Logo End -->

    <!-- Main Nav Start -->
    <ul class="nav nav-minimal flex-row flex-grow-1 justify-content-between flex-xl-column justify-content-xl-center" id="mainNavTab" role="tablist">
        
        <!-- Chats Tab Start -->
        <li class="nav-item">
            <a class="nav-link p-0 py-xl-3 active" id="chats-tab" href="#chats-content" title="Chats">
                <!-- Default :: Inline SVG -->
                <svg class="hw-24" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8h2a2 2 0 012 2v6a2 2 0 01-2 2h-2v4l-4-4H9a1.994 1.994 0 01-1.414-.586m0 0L11 14h4a2 2 0 002-2V6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2v4l.586-.586z"/>
                </svg>

                <!-- Alternate :: External File link -->
                <!-- <img class="injectable hw-24" src="__STATIC__/index/media/heroicons/outline/chat-alt-2.svg" alt="Chat icon"> -->
            </a>
        </li>
        <!-- Chats Tab End -->


 

        <!-- Profile Tab Start -->
        <li class="nav-item">
            <a class="nav-link p-0 py-xl-3" id="profile-tab" href="#profile-content" title="Profile">
                <!-- Default :: Inline SVG -->
                <svg class="hw-24" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5.121 17.804A13.937 13.937 0 0112 16c2.5 0 4.847.655 6.879 1.804M15 10a3 3 0 11-6 0 3 3 0 016 0zm6 2a9 9 0 11-18 0 9 9 0 0118 0z"/>
                </svg>
                    
                <!-- Alternate :: External File link -->
                <!-- <img class="injectable hw-24" src="__STATIC__/index/media/heroicons/outline/user-circle.svg" alt="Profile icon"> -->
            </a>
        </li>
        <!-- Profile Tab End -->
    </ul>
    <!-- Main Nav End -->
</div>
<!-- Navigation End -->